<template>
    <a-modal 
        :visible="visible"
        okText="确定" 
        cancelText="取消"
        :title="title"
        :maskClosable="false"
        :destroyOnClose="true"
        :keyboard="false"
        :closable="false"
        width="1000px"
        @cancel="closeModal()" 
        @ok="handleSubmit">
        <SearchFormTable :url="url" 
            tableSelectType="radio"
            :defaultParams="defaultParams"
            ref="searchtable" 
            :columns="columns" 
            :form="form">
            <template slot="searchForm">
                <a-form layout="inline" :form="form">
                    <a-form-item label="商品名称">
                        <a-input
                            style="width:180px"
                            v-decorator="[
                                'goodsName',
                            ]"
                            placeholder="请输入商品名称"
                            >
                        </a-input>
                    </a-form-item>
                </a-form>
            </template>
            <template slot="oprationRow">
                <permission>
                    <a-space>
                        <a-button type="primary" @click="handleCommodityManage()">商品管理</a-button>
                        <a href="javascript:;" @click="handleRefresh">刷新</a>
                    </a-space>
                </permission>
            </template>
        </SearchFormTable>
        <CommodityManage :visible="commodityManageVisible" @cancel="handleCommodityManageClose"></CommodityManage>
    </a-modal>
</template>

<script>
import SearchFormTable from './SearchFormTable';
import CommodityManage from './CommodityManage';

export default {
    components:{
        SearchFormTable,
        CommodityManage
    },
    props: {
        visible:{
            type:Boolean,
            default:false,
        },
    },
    data(){
        return {
            url:'goldenhome/seckill/admin_/discount/goods/chose',
            form: this.$form.createForm(this, { name: 'table_search' }),
            columns: [
                {
                    title: '商品信息',
                    dataIndex: 'goodsName',
                    key: 'goodsName',
                },
                {
                    title: '库存',
                    dataIndex: 'goodsInventoryTotal',
                    key: 'goodsInventoryTotal'
                },
                {
                    title: '不可选原因',
                    dataIndex: 'reason',
                    key: 'reason'
                }
            ],
            commodityManageVisible:false,
            defaultParams:{
                goodsStatus:2
            }
        }
    },
    computed:{
        title(){
            return '选择商品';
        }
    },
    methods:{
        handleCommodityManageClose(){
            this.commodityManageVisible=false;
            this.handleRefresh();
        },
        closeModal (freshTable) {
            this.$emit('cancel', freshTable)
        },
        handleSubmit(){
            let ids=this.$refs.searchtable.selectedRowKeys;
            if(ids.length==0){
                this.$message.error('请选择一个商品');
                return;
            }
            let id=ids[0];
            console.log(id);
            this.$emit('submit',id);
        },
        //刷新
        handleRefresh(){
            this.$refs.searchtable.refreshTable();
        },
        handleCommodityManage(){
            this.commodityManageVisible=true;
        },
    }
}
</script>

<style lang="less" scoped>
.desc{
    color:#ccc;
}
</style>